import React from 'react';
import moment from 'moment';
import { Breadcrumb, Icon, Input, DatePicker, Button, Table, Checkbox, Modal, Select, Upload, message, Pagination, Form } from 'antd';
import { hashHistory} from 'react-router';
import './indexGoods.less';
import $ from 'jquery';
import Config from '../../common/config';
const config = new Config();
const FormItem = Form.Item;
const token = sessionStorage.getItem('token');
export default class IndexGoods extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            bannerList: [],
            keyword: "",
            stime: "",
            pagesize: 10,
            pageindex: 1,
            bannercount: 1,
            visible: false,
            fileList: [],
            previewVisible: false,
            previewImage: '',
            BannerId: undefined,
            prolist:[]
        }
    }
    componentDidMount() {
        // this.getBannerList();
        this.getPro()
    }
    //获取前端商品展示列表
    getPro(){
        var me=this;
        $.ajax({
            url: `${config.integratedBack}/com/findQdList`,
            type: "get",
            data: {
                t_showqd: '1'
            },
            success: function (d) {
                console.log(d);
                if(d.code==200){
                    me.setState({
                        prolist:d.list
                    })
                }
            }
        })
    }
    //同步商品到前端
    topriew(){
        $.ajax({
            url: `${config.integratedBack}/com/comSyncFront`,
            type: "get",
            success: function (d) {
                console.log(d);
                if(d.code==200){
                    alert('同步成功')
                }
            }
        })
    }
    //删除
    delpro(id){
        console.log(id);
        var me=this;
        $.ajax({
            url: `${config.integratedBack}/com/delCommodity`,
            type: "get",
            data:{
                id:id
            },
            success: function (d) {
                console.log(d);
                if(d.code==200){
                    alert('删除成功');
                    me.getPro();
                }
            }
        })

    }    //获取banner列表
    getBannerList() {
        $.ajax({
            url: `${config.JuseHomepage}/banner/list`,
            type: "get",
            async: true,
            headers: {
                'Authorization': 'Bearer ' + token,
            },
            data: {
                activityName: this.state.keyword,
                startTime: this.state.stime,
                pageSize: this.state.pagesize,
                page: this.state.pageindex
            },
            success: res => {
                if (res.code === 200) {
                    const bannerList = res.data.rows;
                    if (bannerList.length > 0) {
                        bannerList.forEach((ele, i) => {
                            ele.index = i + 1;
                        });
                        this.setState({
                            bannerList,
                            bannercount: res.data.count,
                        });
                    } else {
                        this.setState({
                            bannerList,
                            bannercount: res.data.count,
                        });
                    }
                }
            }
        });
    }

    render() {
        return (
            <div className="index-goods goods-label-cont" >
                <div className="goods-label-cont clearfix" style={{minHeight:0}}>
                    <div className='goods-label-cont-nav clearfix'>
                        <Breadcrumb separator=">">
                            <Breadcrumb.Item>综合平台</Breadcrumb.Item>
                            <Breadcrumb.Item><span className='separator-a'>首页明星产品管理</span></Breadcrumb.Item>
                        </Breadcrumb>
                    </div>
                    <div className='spgl2-2 clearfix'>
                        <div className='member-content-Search'>
                            <Button className='member-button ' icon="plus"  onClick={()=>{hashHistory.push('chooseIndexGoods/0')}} >添加商品</Button>
                            <Button className='member-button ' style={{marginLeft:'20px'}} onClick={this.topriew.bind(this)}>同步到前端</Button>
                        </div>
                    </div>
                    <div className="index-goods-content">
                        <ul>
                            {
                                this.state.prolist.length>0?
                                    this.state.prolist.map((item,index)=>{
                                        return <li>
                                            <div><img src={item.imageUrl+item.listImage} alt=""/></div>
                                            <b>{item.productName}</b>
                                            <p>{item.introduce}</p>
                                            <span className="clearfix">￥{item.marketPrice}&nbsp;&nbsp;
                                                <Button type="danger" onClick={this.delpro.bind(this,item.productId)}>删除</Button>
                                                <Button style={{marginRight:'20px'}} onClick={()=>hashHistory.push('chooseIndexGoods/'+item.productId)}>编辑</Button></span>
                                        </li>
                                    }):''
                            }
                        </ul>
                        {
                            this.state.prolist.length==0?<div>
                                    暂时没有添加任何商品！
                                </div>:''
                        }
                    </div>
                </div>
            </div>
        )
    }
}